<template>
  <v-container class="pa-0">
    <base-subheading>最近更新</base-subheading>

    <v-row
      v-for="(work, i) in works.slice(-4)"
      :key="i"
      align="center"
      class="my-8"
    >
      <v-col
        class="d-flex"
        cols="12"
      >
        <v-img
          :src="work.cover"
          class="mr-3"
          height="36"
          max-width="36"
        />

        <a :href="work.category | transpath2(work._id)">
          <div class="subheading">
            {{work.title}}
          </div>

          <div class="caption">
            {{work.updatedAt | transfulltime}}
          </div>
        </a>
      </v-col>
    </v-row>
  </v-container>
</template>

<script>
  // Utilities
  import { mapState } from 'vuex'

  export default {
    name: 'NewestPosts',

    computed: {
      ...mapState(['works']),
    },
  }
</script>
